<%@ page language="java" isELIgnored="false" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<!DOCTYPE html>
<%@ include file="/WEB-INF/jsp/ResourceGlobal.jsp"%>
<html>
<head>   
 <!-- 这里引入导航信息header.tpl -->
 <meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>招商财富产品详情</title>

<style type="text/css">
	
	/* .div-inline{ display:inline;} */
    .table-p-f{ position: relative; float:left;} 
	.table-p-t{ position: relative; float:left;margin-left: 5%;}
	.span-yellow-20{display:inline-block;width:100%;text-align:center;}
	.lf-20{display:inline-block;width:100%;text-align:center;}
	.lf-span{display:inline-block;width:100%;text-align:center;}
	
	
	.selectionContainer{width:100%;height:5%;min-height:50px;}
	.sub-sel-cont{margin-left:30px;padding-top:20px}
	.fl{float:left}
	.selectCenter{width:100%;height:100%;background-color: #F8F8F8}
	.font-color-white{color: #FFFFFF;background-color: #FF9600;}
	.subSelector {
	    height: 20px;
	    line-height: 3px;
	    display: inline-block;
	    width: auto;
	    padding: 9px;
	    border-radius: 5px;
	    margin-right: 10px;
	    cursor: pointer;
	}
</style>

<script type="text/javascript">

var contextPath = <%=context%>;
var prdPath = '<%=context%>' +'business/product/';
var archivePath = '<%=context%>' +'business/archiveManagement/';
//默认加载
$(function(){
	//把访问路径传到js
	setPathPrefix(prdPath,archivePath);
});
</script>

</head>
<body class="sub-page">
<!-- 顶部导航栏 -->
  <jsp:include page="/WEB-INF/jsp/system/index/homeHead.jsp"></jsp:include>
	<div class="location">
	    <i class="fas fa-home"></i>
	    <p>您现在的位置：主页</p>
	    <p class="current">&gt;招商财富产品线</p>
	    <p class="current">&gt;产品详情</p>
 	</div>
 	
 	
 	<div class="page-content">
		<div class="page-content result-box">
			
		<input id="prdCode" type="hidden" value="${prdInfoVo.subPrdCode}">
		<input id="prdType" type="hidden" value="${prdInfoVo.prdCategory}">
	
		<div><h3>招商财富产品详情</h3></div>
		<div class="hr-line-dotted" id="hr-line-dotted"></div>
		
		<div id="picture" class="model" style="width:100%;display: none;" > 
		  <table>
		  	<colgroup>
                   <col width="30%">
                   <col width="70%">
             </colgroup>
		  	<tr>
		  	  <td class="td-bg-yellow" >
		  	  	<div > 
		  	  		<div >
		  	  			<span class="span-white-50">
		  	  				<c:if test="${not empty treYieldVo.yield }">
		  	  					${treYieldVo.yield}%
		  	  				</c:if>
		  	  			</span>
		  	  		<div>
		        	<div ><span class="span-white-5">${prdInfoVo.subFundSname }</span><div>
		  	  	</div>
		  	  </td>
		  	  <td >
		  	  	  <div class="model-content clear"  >
		  	  	  	
		  	  	  	<div id="timeZone" style="width:100%;height:50px;display:none">
						<div id="titleSelectionContainer" class="selectionContainer">
								<div class="selectCenter">
									<div id="titleSelector" class="sub-sel-cont fl">
									   <span class="fl font-color-black">时间段：</span>
									   	<span class="fl subSelector font-color-black font-color-white time" frequency="90" onclick="chooseTime(this);">近三个月</span>
							            <span class="fl subSelector font-color-black time"  frequency="30" onclick="chooseTime(this);">近一个月</span>
							            <span class="fl subSelector font-color-black time" frequency="15" onclick="chooseTime(this);">近半个月</span>
									</div>
								</div>
						</div>
				    </div>
		  	  	  	
		  	  	  	
			        <div  style="height:200px;"   class="chart resize" id="_2"></div>
			      </div>
		  	  </td>
		  	</tr>
		  </table>
	    </div>
	    
	    <div  class="model-head">
	      	<span class="head-boder-left"></span>
	        <h2>产品信息</h2>
     	</div>

			<div class="page-body">
				<div class="table-responsive">
					<table class="table table-bordered">
			        	<colgroup>
		                    <col width="20%">
		                    <col width="80%">
			             </colgroup>
			        	<tr>
			        		<td class="td-bg-pale" style="text-align: right;padding-right: 15px;">产品名称</td>
			        		<td class="white-bg" style="text-align: left;padding-left: 15px;">${prdInfoVo.subFundSname }</td>
			        	</tr>
			        	<tr>
			        		<td class="td-bg-pale" style="text-align: right;padding-right: 15px;">产品分类</td>
			        		<td class="white-bg" style="text-align: left;padding-left: 15px;">${prdInfoVo.prdCategoryNM }</td>
			        	</tr>
			        	<tr>
			        		<td class="td-bg-pale" style="text-align: right;padding-right: 15px;">运作方式</td>
			        		<td class="white-bg" style="text-align: left;padding-left: 15px;">
			        			<input type="hidden" id="operationMode" name="operationMode" value="${prdInfoVo.operationMode }">
			        			<c:choose>
			        				<c:when test="${prdInfoVo.operationMode eq 1}">开放式</c:when>
			        				<c:otherwise>封闭式</c:otherwise>
			        			</c:choose>
			        		</td>
			        	</tr>
			        	
			        	<tr id="openFrequency" style="display:none">
			        		<td class="td-bg-pale" style="text-align: right;padding-right: 15px;">流动性安排</td>
			        		<td class="white-bg" style="text-align: left;padding-left: 15px;">${prdInfoVo.openFrequencyNM }</td>
			        	</tr>
			        	
			        	<tr>
			        		<td class="td-bg-pale" style="text-align: right;padding-right: 15px;">存续期限</td>
			        		<td class="white-bg" style="text-align: left;padding-left: 15px;">${prdInfoVo.prdTerm } 年</td>
			        	</tr>
			        	<tr>
			        		<td class="td-bg-pale" style="text-align: right;padding-right: 15px;">产品规模</td>
			        		<td class="white-bg" style="text-align: left;padding-left: 15px;">${prdInfoVo.expectedRaiseAmt }元</td>
			        	</tr>
			        	<tr>
			        		<td class="td-bg-pale" style="text-align: right;padding-right: 15px;">初始份额面值</td>
			        		<td class="white-bg" style="text-align: left;padding-left: 15px;">人民币${prdInfoVo.initParValue }元/份</td>
			        	</tr>
			        	<tr>
			        		<td class="td-bg-pale" style="text-align: right;padding-right: 15px;">最低认购金额(个人)</td>
			        		<td class="white-bg" style="text-align: left;padding-left: 15px;">${prdInfoVo.indBookStart }</td>
			        	</tr>
			        
			        	<tr>
			        		<td class="td-bg-pale" style="text-align: right;padding-right: 15px;">业绩比较基准</td>
			        		<td class="white-bg" style="text-align: left;padding-left: 15px;">
			        		    
			        		    <c:choose>
			        		    	<c:when test="${prdInfoVo.expectedClientYield eq null or prdInfoVo.expectedClientYield eq '' }">
			        		    		无
			        		    	</c:when>
			        		    	<c:otherwise>
			        		    		${prdInfoVo.expectedClientYield }
			        		    	</c:otherwise>
			        		    </c:choose>
			        		</td>
			        	</tr>
			        	<tr>
			        		<td class="td-bg-pale" style="text-align: right;padding-right: 15px;">产品收益分配</td>
			        		<td class="white-bg" style="text-align: left;padding-left: 15px;">${prdInfoVo.fitCycleNM }</td>
			        	</tr>
			        	<tr>
			        	
			        		<td class="td-bg-pale" style="text-align: right;padding-right: 15px;white-space:normal;">投资范围</td>
			        		<td class="white-bg" style="text-align: left;padding-left: 15px;">
			        			<%-- ${prdInfoVo.investSpec } --%>
			        			<%
									request.setAttribute("vEnter", "\n");
								%>
								${fn:replace(prdInfoVo.investSpec, vEnter, '<br/>') }
			        		</td>
			        	</tr>
			        	<tr>
			        		<td class="td-bg-pale" style="text-align: right;padding-right: 15px;">投资策略</td>
			        		<td class="white-bg" style="text-align: left;padding-left: 15px;">
			        			<%-- ${prdInfoVo.investStrategy } --%>
			        			<%
									request.setAttribute("vEnter", "\n");
								%>
								${fn:replace(prdInfoVo.investStrategy, vEnter, '<br/>') }
			        		</td>
			        	</tr>
			        	<tr>
			        		<td class="td-bg-pale" style="text-align: right;padding-right: 15px;">退出费率</td>
			        		<td class="white-bg" style="text-align: left;padding-left: 15px;">${prdInfoVo.breachFeeRate }%</td>
			        	</tr>
			        	<!-- <tr>
			        		<td class="td-bg-pale" style="text-align: right;padding-right: 15px;">投资服务费率</td>
			        		<td class="white-bg" style="text-align: left;padding-left: 15px;">0.13%</td>
			        	</tr> -->
			        	<tr>
			        		<td class="td-bg-pale" style="text-align: right;padding-right: 15px;">风险收益特征</td>
			        		<td class="white-bg" style="text-align: left;padding-left: 15px;">
			        		<%-- ${prdInfoVo.riskYield } --%>
			        		<%
								request.setAttribute("vEnter", "\n");
							%>
							${fn:replace(prdInfoVo.riskYield, vEnter, '<br/>') }
			        		</td>
			        	</tr>
			        </table>
				</div>
				
				<div  class="model-head">
			      	<span class="head-boder-left"></span>
			        <h2>费率结构</h2>
			    </div>
			    
			    
		      	<div class="model-content" style="width:100%;">
		      		<table class="table-p-f table" style="width:45%">
			        	<tr> <td class="white-bg" colspan="3" ><span class="lf-span">费率信息</span></td> </tr>
			        	<tr> 
			        		<td class="td-sp white-bg">
			        			<div>
			        				<span class="span-yellow-20" >
				        				<c:forEach var="feeVo" items="${prdFees}">
				        					<c:if test="${feeVo.feeCode eq 'GLF' }">
				        						${feeVo.feeRate}%
				        					</c:if>
				        				</c:forEach>
			        				</span>
			        			<div>
			        			<div class="lf-20">管理费<div>
			        		</td> 
			        		<td class="td-sp white-bg">
			        			<div>
			        				<span class="span-yellow-20">
				        				<c:forEach var="feeVo" items="${prdFees}">
				        					<c:if test="${feeVo.feeCode eq 'TGF' }">
				        						${feeVo.feeRate}%
				        					</c:if>
				        				</c:forEach>
			        				</span>
								<div>
			        			<div class="lf-20">托管费<div>
			        		</td> 
			        		<td class="td-sp white-bg" style="height: 65px;">
			        			<div>
			        				<span class="span-yellow-20">
				        				<c:forEach var="feeVo" items="${prdFees}">
				        					<c:if test="${feeVo.feeCode eq 'XSFWF' }">
				        						${feeVo.feeRate}%
				        					</c:if>
				        				</c:forEach>
			        				</span>
								<div>
			        			<div class="lf-20">销售服务费<div>
			        		</td> 
			        	</tr>
			        </table>
			        
			        <table class="table-p-t table" style="width:45%">
			        	<tr style="width:100%"> <td class="white-bg" colspan="3" ><span class="lf-span">申赎费率<span></td> </tr>
			        	<tr style="width:100%"> 
			        		<td class="td-sp white-bg" style="width:100%">
			        			<div>
			        				<span class="span-yellow-20">${prdInfoVo.bookFeeRate }%</span>
								<div>
			        			<div class="lf-20">认购费率<div>
			        		</td> 
			        		<td class="td-sp white-bg" style="width:100%">
			        			<div>
			        				<span class="span-yellow-20">${prdInfoVo.declareFeeRate }%</span>
								<div>
			        			<div  class="lf-20">申购费率<div>
			        		</td> 
			        		<td class="td-sp white-bg" style="width:100%">
			        			<div>
			        				<span class="span-yellow-20">${prdInfoVo.redeemFeeRate }%</span>
								<div>
			        			<div  class="lf-20">赎回费率<div>
			        		</td> 
			        	</tr>
			        </table>
		      	</div>
		        				
				<div class="model">
			    	<div  class="model-head">
				    </div>
			    </div>
			    <div class="model">
			    	<div  class="model-head">
				    </div>
			    </div>
	    
	    
				<div class="model">
					<div class="model-head">
						<span class="head-boder-left"></span>
						<h2>附件</h2>
					</div>
					<div class="model-content clear">
						<c:if test="${empty attachVos }">
							无
						</c:if>
						<ul class="list-group file-list">
							<c:forEach var="attach" items="${attachVos }">
								<li class="list-group-item col-sm-12">
									<div class="col-sm-8">
										● <a href="/solution/sys/attach/downloadAttach.do?attId=${attach.attId }">${attach.attName }</a>
									</div>
									<div class="col-sm-4 align-right">${attach.createTime }</div>
								</li>
							</c:forEach>
						</ul>
					</div>
				</div>
			</div>
			<div class="page-footer"></div>
		</div>
	
	</div>

	<script type="text/javascript" src="<%=context%>/resources/modules/business/product/prdInfoDetail.js?random=<%=Math.random()%>"></script>

</body>

	
</html> 

